<template>
	<div class="login">
		<div class="login-header">
			<img src="../assets/tao.png" alt="">
		</div>
		<div class="login-main">
			<form >
				<input type="text" v-model="name" placeholder="请 输 入 账 号" name="name">
				<input type="password" v-model="password" placeholder="请 输 入 密 码" name="password" />
				<a class="regist" href="#/register">免费注册</a>
				<a class="forget" href="#/res-register">忘记密码</a>
				<button  @click="Click($event)">登录</button>
			</form>

		</div>
	</div>
</template>

<script>
	import axios from 'axios'

	export default {
		components: {

		},
		data() {
			return {
				name: '',
				password: ''
			}
		},
		
		methods: {
			Click(ev) {			
				ev.preventDefault();
						var that = this;
						axios.post('/taobao/login', {
							name: that.name,
							password: that.password,
							phone: that.phone
						}).then(function(result) {
							console.log(result);
							var data = result.data;
							if(data.error == 0) {
								alert(data.msg);			
								setTimeout(function(){
									location.href = '#/';
									location.reload('/');
								})
											
							} else {
								alert(data.msg);
							}
						})
				}
			}
	}
</script>

<style scoped="">
	.login {
		text-align: center;
		width: 360px;
	}
	
	.login-header img {
		width: 60px;
		margin: 80px auto;
		margin-bottom: 40px;
	}
	
	.login-main {
		padding: 0 40px;
		
	}
	
	.login-main input {
		width: 100%;
		border: none;
		border-bottom: solid 1px orangered;
		font-size: 15px;
		margin-top: 30px;
		line-height: 25px;
		display: inline-block;
	}
	
	.login-main form button {
		width: 100%;
		margin-top: 25px;
		cursor: pointer;
		border: none;
		background: -webkit-linear-gradient(left, #ff9000, #ff6000);
		border-radius: 30px;
		line-height: 45px;
		font-size: 18px;
		color: #fff;
	}
	
	.login-main a {
		color: #666;
		margin-top: 10px;
	}
	
	.login-main .regist {
		float: left;
	}
	
	.login-main .forget {
		float: right;
	}
</style>